<template>
  <BasicDrawer v-bind="$attrs" @register="registerDrawer" title="人员列表" width="1100px" @ok="handleSubmit">
    <div style="font-size:18px;color:#000;padding-left: 20px">当前分组：{{groupName}}</div>
    <BasicTable @register="registerTable"  :rowSelection="rowSelection">
      <template #tableTitle>
      </template>
      <template v-slot:bodyCell="{column, record, index}">
        <template v-if="column.dataIndex ==='action'">
          <TableAction :actions="getTableAction(record)" />
        </template>
      </template>
     
    </BasicTable>
  </BasicDrawer>
</template>
<script lang="ts" setup>
  import { ref, unref } from 'vue';
  import { toRaw } from '@vue/reactivity';
  import { BasicDrawer, useDrawerInner } from '/src/components/Drawer';
  import { BasicTable, useTable, TableAction } from '/src/components/Table';
  import { useDesign } from '/@/hooks/web/useDesign';
  import { useListPage } from '/@/hooks/system/useListPage'

  import { acPersonGroupColumns, acPersonGroupSearchFormSchema } from '../AcGroup.data';
  import { acPersonGroupList,addselectAcPersonGroup } from '../AcGroup.api';
  import { ColEx } from '/@/components/Form/src/types';


  // const { prefixCls } = useDesign('row-invalid');
  const isNotGroupId = ref('');
  const groupName = ref('');

  const [registerDrawer, { setDrawerProps, closeDrawer }] = useDrawerInner(async (data) => {
    isNotGroupId.value = data.id;
    groupName.value = data.name;
    showFooter.value = data?.showFooter ?? true;
    setDrawerProps({ confirmLoading: false, showFooter: showFooter.value });
    setProps({ searchInfo: { isNotGroupId: unref(isNotGroupId) } });
    reload();
  });
  const { tableContext,onExportXls,onImportXls } = useListPage({
      tableProps:{
           title: '查看人员',
           api: acPersonGroupList,
           columns :acPersonGroupColumns,
           canResize:false,
           rowKey:'personId',
           showActionColumn: false,
           formConfig: {
              labelWidth: 65,
              schemas: acPersonGroupSearchFormSchema,
              autoSubmitOnEnter:true,
              showAdvancedButton:true,
              fieldMapToNumber: [
              ],
              fieldMapToTime: [
              ],
            },
           actionColumn: {
               width: 120,
               fixed:'right'
            },
      },
     
  })
  const [registerTable, {reload,getForm,setProps},{ rowSelection, selectedRowKeys }] = tableContext



  const showFooter = ref(true);


  //提交事件
  async function handleSubmit() {
    try {
      // let values = await validate();
      // setDrawerProps({ confirmLoading: true });
      // values.userIdentity === 1 && (values.departIds = '');
      // let isUpdateVal = unref(isUpdate);
      // //提交表单
      // await saveOrUpdateUser(values, isUpdateVal);
      //关闭弹窗
      let selectIds = toRaw(rowSelection.selectedRowKeys)
      // if(selectId.length==0) return $message('请先选择人员')
      console.log(isNotGroupId.value)

      await addselectAcPersonGroup({
          groupId:isNotGroupId.value,
          personList: selectIds
      })

      handleSuccess()
      // closeDrawer();
      //刷新列表
      // emit('success',{isUpdateVal ,values});
    } finally {
      setDrawerProps({ confirmLoading: false });
    }
  }

  function handleSuccess() {
      (selectedRowKeys.value = []) && reload();
   }
 

 
</script>
<style scoped lang="less">
  @prefix-cls: ~'@{namespace}-row-invalid';

  :deep(.@{prefix-cls}) {
    background: #f4f4f4;
    color: #bababa;
  }
</style>
